<template>
  <div
    v-title
    data-title="入库工作台"
    v-loading="gLoad"
    element-loading-text="数据正在提交,请稍后"
    element-loading-spinner="el-icon-loading"
  >
    <!--  顶部当前扫描明细  -->
    <el-card class="box-card" shadow="hover">
      <div>
        <!--   扫描框   -->
        <el-input
          v-model="scanInput"
          :placeholder="scanInputPlaceholder"
          class="headerInputClass"
          @keydown.enter.native="enterScanInput()"
          ref="scanInputfocus"
          @focus="$event.currentTarget.select()"
          autofocus="autofocus"
        >
        </el-input>
      </div>
      <!--   扫描明细   -->
      <div>
        <el-descriptions class="margin-top" border :column="3">
          <el-descriptions-item
            label-class-name="my-label"
            content-class-name="my-content"
            label="托盘"
          >
            {{ CID }}
          </el-descriptions-item>
          <el-descriptions-item
            label-class-name="my-label"
            content-class-name="my-content"
            label="任务号"
          >
            {{ CurrentGoods.ChildOrderNo }}
          </el-descriptions-item>
          <el-descriptions-item
            label-class-name="my-label"
            content-class-name="my-content"
            label="批次"
          >
            {{ CurrentGoods.BatchNo }}
          </el-descriptions-item>
          <el-descriptions-item
            label-class-name="my-label"
            content-class-name="my-content"
            label="物料编码"
          >
            {{ CurrentGoods.SkuId }}
          </el-descriptions-item>
          <el-descriptions-item
            label-class-name="my-label"
            content-class-name="my-content"
            label="物料描述"
          >
            {{ CurrentGoods.SkuName }}
          </el-descriptions-item>
        </el-descriptions>
      </div>
    </el-card>
    <el-row :gutter="12" class="box-card card_box">
      <el-col :span="9">
        <el-card shadow="hover" class="box-card_detail paddingStyle">
          <div slot="header" class="clearfix">
            <span>待入库列表</span>
          </div>

          <el-table
            :data="AllGoods"
            height="41vh"
            border
            style="width: 100%; font-size: calc(100vh - 98.5vh)"
          >
            <el-table-column
              align="center"
              prop="ChildOrderNo"
              label="任务号"
              sortable
            ></el-table-column>
            <el-table-column
              align="center"
              prop="CID"
              label="托盘号"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="SkuId"
              label="物料编码"
              sortable
            ></el-table-column>
            <el-table-column
              align="center"
              prop="BatchNo"
              label="批次编码"
              sortable
            ></el-table-column>
            <el-table-column
              align="center"
              prop="QtyPlan"
              label="待扫数"
              sortable
            ></el-table-column>
            <!-- <el-table-column align='center' prop="BatchNo" label="批次"></el-table-column> -->
          </el-table>
        </el-card>
      </el-col>
      <!--      <el-col :span="8">-->
      <!--        <el-card shadow="hover" class="box-card_detail imageClass">-->
      <!--          <div slot="header" class="clearfix">-->
      <!--            <span>物料信息</span>-->
      <!--          </div>-->
      <!--          <div class="imageClass">-->
      <!--            <el-image :src="CurrentGoods.ImgUrl" lazy></el-image>-->
      <!--            &lt;!&ndash;支持本地图片下载&ndash;&gt;-->
      <!--            &lt;!&ndash;<el-image :src="localhostPath+CurrentGoods.ImgUrl" lazy></el-image>&ndash;&gt;-->
      <!--          </div>-->
      <!--        </el-card>-->
      <!--      </el-col>-->
      <!--   本次上架明细   -->
      <el-col :span="5">
        <el-card shadow="hover" class="box-card_detail">
          <div slot="header" class="clearfix">
            <span>数量信息</span>
          </div>
          <div>
            <div class="ItemNumInfo" @click="clickCalculator()">
              <span v-show="!CalculatorDialogVisible">{{ scansNum }}</span>
              <el-input-number
                :min="0"
                :controls="false"
                :precision="0"
                @blur="CalculatorDialogVisible = false"
                v-model="scansNum"
                placeholder="请输入内容"
                ref="scansNumREF"
                @change="clickCardOk"
                @focus="$event.currentTarget.select()"
                v-show="CalculatorDialogVisible"
                clearable
              ></el-input-number
              >/{{ scansTotalNum }}
            </div>

            <br /><br />
            <div class="ItemNumlabel">扫描数量/需上架数量</div>
            <div class="ItemNumInfoDetail" v-show="false">
              单位：{{ CurrentGoods.Unit }}
            </div>
            <div class="ItemNumInfoDetail" v-show="false">
              规格：<span>{{ CurrentGoods.Spec }}</span>
            </div>
            <div class="ItemNumInfoDetail_Weight">
              重量：<span>{{ CurrWeight }} KG</span>
            </div>
          </div>
        </el-card>
      </el-col>
      <!--   上架列表  已扫描的货物明细   -->
      <el-col :span="10">
        <el-card shadow="hover" class="box-card_detail paddingStyle">
          <div slot="header" class="clearfix">
            <span>已扫描列表</span>
          </div>
          <el-table
            :data="ScanRecord"
            height="41vh"
            border
            style="width: 100%; font-size: calc(100vh - 98.5vh)"
          >
            <el-table-column
              align="center"
              prop="ChildOrderNo"
              label="任务号"
              sortable
            ></el-table-column>
            <el-table-column
              align="center"
              prop="SkuId"
              label="物料编码"
              sortable
            ></el-table-column>
            <el-table-column
              align="center"
              prop="BatchNo"
              label="批次编码"
              sortable
            ></el-table-column>
            <el-table-column
              align="center"
              prop="QtyIn"
              label="已扫数"
              sortable
            ></el-table-column>
            <el-table-column
              align="center"
              prop="FromCID"
              label="源托盘"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="ToCID"
              label="目标托盘"
            ></el-table-column>
            <el-table-column
              align="center"
              prop="LocationId"
              label="目标库位"
              sortable
            ></el-table-column>
          </el-table>
        </el-card>
      </el-col>
    </el-row>
    <el-card shadow="never" class="card_button">
      <!--			<el-button @click='$router.push(`/index`)' type="warning">返回主页</el-button>-->

      <el-button
        type="danger"
        @click="
          scanInputMethod('OrderID');
          audioPlay('ok');
        "
        >重置工作台</el-button
      >
      <el-button @click="PrintBarcode()">打印条码</el-button>
      <!--      <el-button type="danger" @click='EmptyContainer()'>清空容器</el-button>-->
      <!--      <el-button type="danger" @click='EmptyBox()'>清空扫描</el-button>-->
      <!--      <el-button type="danger" @click='CallEmptyCID()'>呼叫空托</el-button>-->
      <el-button
        type="danger"
        :disabled="!unbindBottn"
        @click="
          LocationErrorVisible = true;
          $nextTick(() => {
            this.$refs.unbindInfoCID.focus();
          });
        "
        >库位异常</el-button
      >
      <el-button
        type="primary"
        class="buttonClass"
        @click="WeightSocket(CurrentGoods.ToLoc)"
        :loading="submit.loading"
        :disabled="!unbindBottn"
        >入库完成
        <!-- !Weight_Flag -->
      </el-button>
      <span style="margin-left: 30px"
        >工作台: {{ UserInfo.WbInfo.WbName }}</span
      >
    </el-card>
    <!-- 数字输入  -->
    <!-- <el-dialog :visible.sync="CalculatorDialogVisible" width="30%">
			<Calculator v-on:clickCardOk="clickCardOk" />
		</el-dialog> -->
    <!-- 完成输入 scanInputMethod -->
    <el-dialog
      title="绑托上架"
      :visible.sync="CommitVisible"
      width="30%"
      class="dialog_commit"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
    >
      <el-form label-width="12vh" :model="CommitFrom">
        <el-form-item label="托盘编码">
          <el-input
            v-model="CommitFrom.CID"
            placeholder="请扫描托盘编码"
            ref="COMMITCID"
            @keydown.enter.native="
              this.$nextTick(() => {
                this.$refs.COMMITLoc.focus();
              })
            "
          ></el-input>
        </el-form-item>
        <el-form-item label="库位编码">
          <el-input
            ref="COMMITLoc"
            v-model="CommitFrom.LocationId"
            placeholder="请扫描库位编码"
            @keydown.enter.native="CompleteTask()"
          ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button
          @click="
            CommitVisible = false;
            CommitFrom = { CID: '', LocationId: '' };
          "
          >取 消</el-button
        >
        <el-button type="primary" @click="CompleteTask()">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 库位解绑 LocationErrorVisible -->
    <el-dialog
      title="库位异常"
      :visible.sync="LocationErrorVisible"
      width="30%"
      class="dialog_commit"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
    >
      <el-form label-width="12vh" :model="unbindInfo">
        <el-form-item label="托盘编码">
          <el-input
            v-model="unbindInfo.CID"
            placeholder="请扫描托盘编码"
            ref="unbindInfoCID"
          ></el-input>
        </el-form-item>
        <el-form-item label="库位编码">
          <el-input
            ref="unbindInfoLoc"
            v-model="unbindInfo.LocationId"
            placeholder="请扫描库位编码"
          ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button
          @click="
            LocationErrorVisible = false;
            unbindInfo = { CID: '', LocationId: '' };
          "
          >取 消</el-button
        >
        <el-button type="primary" @click="LocationError()">确 定</el-button>
      </span>
    </el-dialog>
    <!--    提示音  -->
    <audioPaly :audioValue="audioPaly"></audioPaly>
  </div>
</template>

<script>
import Arithmetic from '@/utils/ArithmeticMethod.js'
import TrayGridVerification from '@/utils/public_function.js'
import {
  PrevLoading
} from '@/utils/loading.js'
import {
  GETWarehousingWCTaskInfo,
  GETWarehousingWCTaskScannedInfo, //获取扫描
  PUTWarehousingWCTaskInfo, //添加扫描
  DELETEWarehousingTaskScannedInfo, //删除扫描
  POSTWarehousingTaskScannedInfo, //完成扫描
  GetCIDInfo,
  EmptyCID,
  PTL_ACTION,
  GETLocationInfo,
  PostWarehousingWCTaskInfo,
  otherunbind,
  GetCIDInfoWC //快速入库
} from '@/api/api.js'
import Calculator from '@/components/pluginunit/Calculator.vue'
import audioPaly from '@/components/pluginunit/audioPaly.vue'
import {
  createSocket
} from "@/utils/WebSocket";

export default {
  name: 'WarehousingOPTWC',
  props: ['searchVal'],
  components: {
    Calculator,
    audioPaly
  },
  data () {
    return {
      submit: {
        loading: false,
      },
      unbindBottn: false,
      unbindInfo: {
        LocationId: '',
        CID: ''
      },
      LocationId: '',
      // 绑托上架 按钮
      PositionBinding: true,
      audioPaly: '',
      // 扫描框数据
      scanInput: '',
      // 扫描框当前扫描类型
      scanType: 'OrderID',
      // 扫描框显示
      scanInputPlaceholder: '',
      scanInputType: {
        'OrderID': '请扫描托盘号或任务号.....',
        'ChildOrderNo': '请扫描任务号.....',
        'BatchNo': '请扫描任务批次号.....',
        'CID': '请输入数量后,扫描容器（料箱）编码.....',
        'LocationId': '请置完成后扫描库位编码.....',
        'PTLLighting': '请等待称重完成后,拍灯提交.....'
      },
      // 当前扫描物料信息（显示）
      CurrentGoods: {
        SkuId: '',
        SkuName: '',
        ImgUrl: ''
      },
      ChildOrderNo: '',
      // 全部应扫描物料
      AllGoods: [],
      // 已扫描物料
      ScannedGoods: [],
      // 扫描记录
      ScanRecord: [],
      // 完成任务或者呼叫空托提交的扫描记录
      CommitScanRecord: [],
      // 全部入库数（不考虑物料种类）
      ScanAllCount: 0.0,
      // 当前扫描数
      ScanCurrentCount: 0.0,
      // 已扫描物料数（不考虑物料种类）
      ScanGoodCount: 0.0,
      // 页面显示应扫描数
      scansTotalNum: 0.0,
      // 页面显示当前已扫描数
      scansNum: 0.0,
      // 数量输入框显隐标识
      CalculatorDialogVisible: false,
      // 绑托上架标识
      CommitVisible: false,
      localhostPath: "",
      TargetLocationId: '',
      UserInfo: {
        WbInfo: {
          WbName: ''
        }
      },
      CommitFrom: {
        CID: '',
        LocationId: ''
      },
      CID: '',
      // 仓库ID
      WarehouseId: '',
      // 货主ID
      StorerId: '',
      // 灯所需参数
      getSocketData: null,
      //打印wsURL
      print_url: 'ws://localhost:13145/Print?UserId=',
      ptl_url: 'ws://localhost:13145/Ptl',
      weight_url: "ws://localhost:13145/Weight",
      login_url: "ws://localhost:13145/Login?UserId=",
      ws: {
        print_ws: null,
        ptl_ws: null,
        weight_ws: null,
        login_ws: null
      },
      setIntervalWesocketPush: {
        print_ws: null,
        ptl_ws: null,
        weight_ws: null,
        login_ws: null
      },
      //灯颜色
      ColorEnum: {
        red: 1,
        green: 2,
        blue: 3,
        yellow: 4,
        pink: 5,
        cyan: 6,
        white: 7
      },
      Weight: 35000,
      Weight_Flag: false,
      CurrWeight: 0,
      PTL_FLAGE: false,
      gLoad: false,
      LocationErrorVisible: false,
      scanChildOrderLineFlag: ''
      //  结束
    }
  },
  created () {
    window.removeEventListener('onmessageWS', this.getSocketData);
    this.UserInfo = JSON.parse(sessionStorage.getItem('userInfo'))
    this.scanInputMethod(this.scanType)
    this.init()
    this.getUrlPath()
  },
  methods: {
    GETTaskInfo (value, flag = false) {
      this.scanInputMethod('OrderId')
      this.gLoad = true
      const params = {
        UserId: this.UserInfo.UserId,
        CID: value,
        WbId: this.UserInfo.WbInfo.WbId,
        time: Date.parse(new Date())
      }
      GETWarehousingWCTaskInfo(params).then(res => {
        const result = res.data.data
        if (res.data.code == 0 && result.length != 0) {
          // 收集全部扫描数
          this.AllGoods = result
          console.log('AllGoods', this.AllGoods);
          this.CID = result[0].CID
          result.forEach((item, index) => {
            if (item.ChildOrderNo == value) {
              this.scanChildOrderLineFlag = value
            }
          })
          this.LocationId = result[0].LocationId
          this.unbindBottn = false
          // 获取已扫描数据
          this.GETTaskScanedInfo(value)
        } else {
          if (flag) {
            this.audioPlay('notexist')
            this.$message({
              message: res.data.message,
              type: 'error'
            });
          } else {
            this.$notify({
              message: res.data.message,
              title: '提示',
              type: 'success'
            });
            this.audioPlay('ok')
            this.scanInputMethod("OrderID")
          }
        }
        this.gLoad = false
      }).catch(error => {
        this.audioPlay('error')
        throw error
        this.gLoad = false
      })
    },
    GETTaskScanedInfo (value) {
      this.gLoad = true
      const params = {
        UserId: this.UserInfo.UserId,
        CID: value,
        LocationId: this.LocationId,
        WbId: this.UserInfo.WbInfo.WbId,
        time: Date.parse(new Date())
      }
      this.scanChildOrderLineFlag = ''
      GETWarehousingWCTaskScannedInfo(params).then(res => {
        const result = res.data.data
        if (res.data.code == 0) {
          // 收集已扫描数
          // this.ScannedGoods = result
          this.ScannedGoods = result
          this.ScanRecord = this.ScannedGoods
          this.SummarizeTaskInfo('init')
          this.scanInputMethod('ChildOrderNo')
          if (this.scanChildOrderLineFlag !== '') {
            this.ScanChildOrderNoInfo(this.scanChildOrderLineFlag)
            //   this.scanChildOrderLineFlag = ''
          }
          this.audioPlay('ok')
        } else {
          this.$message({
            message: res.data.message,
            type: 'warning'
          });
        }
        this.gLoad = false
      }).catch(error => {
        this.gLoad = false
        throw error
      })

    },
    LocationError () {
      if (this.unbindInfo.CID == '') {
        this.$message({
          message: "料箱不可为空",
          type: 'error'
        });
        this.audioPlay('error')
        return
      }
      if (this.unbindInfo.LocationId == '') {
        this.$message({
          message: "库位不可为空",
          type: 'error'
        });
        this.audioPlay('error')
        return
      }
      const params = {
        UserId: this.UserInfo.UserId,
        CID: this.unbindInfo.CID,
        WbId: this.UserInfo.WbInfo.WbId,
        LocationId: this.unbindInfo.LocationId,
        time: Date.parse(new Date())
      }
      this.$confirm('此操作将禁用' + this.unbindInfo.LocationId + '库位，是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.gLoad = true
        otherunbind(params).then(res => {
          const result = res.data
          if (res.data.code == 0) {
            // 收集已扫描数
            this.TargetLocationId = ''
            this.CurrentGoods.ToCID = ''
            this.$message({
              message: result.messgae,
              type: 'success'
            });
            this.$message({
              message: "请重新扫描需要入库的托盘",
              type: 'success'
            });
            this.LocationErrorVisible = false
            this.unbindBottn = false
            this.scanInputMethod('CID')
            this.audioPlay('ok')
          } else {
            this.$message({
              message: res.data.message,
              type: 'warning'
            });
          }
          this.gLoad = false
        }).catch(error => {
          this.gLoad = false
          throw error
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        });
      });
    },
    // 输入数量呼叫空托
    CallEmptyCID () {
      this.$prompt('请输入要呼叫的空托数', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        inputPattern: /^[1-9]\d*$/,
        inputErrorMessage: '请输入正确的数字'
      }).then(({
        value
      }) => {
        const params = {
          "CIDNumber": parseInt(value),
          "WbId": this.UserInfo.WbInfo.WbId,
          "UserId": this.UserInfo.UserId
        }
        EmptyCID(params).then(res => {
          const result = res.data.data
          if (res.data.code == 0) {
            this.$message({
              message: res.data.message,
              type: 'success'
            });
            this.audioPlay('success')
          } else {
            this.$message({
              message: res.data.message,
              type: 'error'
            });
            this.audioPlay('error')
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '取消输入'
        });
      });
    },
    CompleteTaskButton1 () {
      this.CommitVisible = true
      this.$nextTick(() => {
        this.$refs.COMMITCID.focus()
      })
    },
    // 完成按钮
    CompleteTask () {
      this.submit.loading = true
      if (this.CommitFrom.LocationId == '') {
        this.audioPlay('error')
        this.$alert('请确认是否扫描库位编码', '警告', {
          confirmButtonText: '确定',
        });
        return
      }
      if (this.CommitFrom.CID == '') {
        this.audioPlay('error')
        this.$alert('请确认扫描托盘编码是否正确', '警告', {
          confirmButtonText: '确定',
        });
        return
      }
      const params = {
        UserId: this.UserInfo.UserId,
        WbId: this.UserInfo.WbInfo.WbId,
        BillId: this.BillId,
        CID: this.CommitFrom.CID,
        LocationId: this.CommitFrom.LocationId,
        time: Date.parse(new Date())
      }
      PostWarehousingWCTaskInfo(params).then(res => {
        const result = res.data.data
        if (res.data.code == 0) {
          this.$message({
            message: res.data.message,
            type: 'success'
          });
          this.scanInputMethod('SkuID')
          this.CompleteOrder()
          this.CommitFrom = {
            CID: '',
            LocationId: ''
          }
          this.$nextTick(() => {
            this.$refs.COMMITCID.focus()
          })
          this.audioPlay('success')
        } else {
          this.audioPlay('error')
          this.$alert(res.data.message, '警告', {
            confirmButtonText: '确定',
            callback: action => {
              this.CommitFrom = {
                CID: '',
                LocationId: ''
              }
            }
          });
        }
      }).catch(error => {
        throw error
      })
      this.submit.loading = false
    },
    CompleteOrder () {
      let allScanCount = 0.0;
      let allCount = 0.0;
      this.ScanRecord.forEach(item => {
        allScanCount = Arithmetic.accAdd(allScanCount, item.QtyIn)
      })
      this.AllGoods.forEach(item => {
        allCount = Arithmetic.accAdd(allCount, item.QtyPlan)
      })
      console.log('this.ScanRecord', this.ScanRecord)
      for (var i = 0; i < this.ScanRecord.length; i++) {
        if ((this.ScanRecord[i].LocationId == undefined || this.ScanRecord[i].LocationId == null || this
          .ScanRecord[i].LocationId == "" || this.ScanRecord[i].LocationId == '')) {
          return
        }
      }
      if (allCount != allScanCount) {
        return
      }
      this.scanInputMethod('OrderID')
      this.CommitVisible = false
    },
    // 清空扫描
    EmptyBox () {
      if (this.submit.loading) {
        this.$message({
          message: "请等待当前任务操作完成",
          type: 'error'
        });
        this.audioPlay('error')
        return
      }
      if (this.StorerId == '' || this.BillId == '') {
        this.audioPlay('error')
        this.$message({
          message: "请确认要订单信息",
          type: 'error'
        });
        return
      }
      this.$confirm('<span style="font-size:20px">是否清空扫描记录</span>', '清空扫描', {
        confirmButtonText: '确定清空',
        cancelButtonText: '取消清空',
        dangerouslyUseHTMLString: true,
        type: 'warning'
      }).then(() => {
        const params = {
          DelType: 'Box',
          UserId: this.UserInfo.UserId,
          BillId: this.BillId,
          WbId: this.UserInfo.WbInfo.WbId,
          StorerId: this.StorerId,
          time: Date.parse(new Date())
        }
        DELETEWarehousingTaskScannedInfo(params).then(res => {
          var result = res.data
          if (result.code == 0) {
            this.$message({
              message: '清空容器成功',
              type: 'success'
            });
            this.audioPlay('success')
            this.scanInputMethod('OrderID')
          } else {
            this.audioPlay('error')
            this.$message({
              message: res.data.message,
              type: 'error'
            });
          }
        });
      }).catch((error) => {
        console.log(error)
        this.$message({
          type: 'info',
          message: '清空操作已取消'
        });
      });
    },
    getUrlPath () {
      let wPath = window.document.location.href;
      // 获取当前页面主机地址之后的目录,如：/admin/index
      let pathName = this.$route.path;
      let pos = wPath.indexOf(pathName);
      // 获取主机地址,如：http://localhost:8080
      this.localhostPath = wPath.substring(0, pos).split('#')[0];
      this.localhostPath = this.localhostPath.substring(0, this.localhostPath.length - 1);
    },
    // 清空容器
    EmptyContainer () {
      if (this.submit.loading) {
        this.audioPlay('error')
        this.$message({
          message: "请等待当前任务操作完成",
          type: 'error'
        });
        return
      }
      if (this.StorerId == '' || this.CID == '') {
        this.audioPlay('error')
        this.$message({
          message: "请确认要清空的订单信息",
          type: 'error'
        });
        return
      }
      this.$prompt('<span style="font-size:25px">请扫描容器编码</span>', '清空容器', {
        confirmButtonText: '确定清空',
        cancelButtonText: '取消清空',
        dangerouslyUseHTMLString: true,
        center: false
      }).then(({
        value
      }) => {
        const params = {
          DelType: 'Container',
          UserId: this.UserInfo.UserId,
          BillId: this.BillId,
          CID: value,
          WbId: this.UserInfo.WbInfo.WbId,
          StorerId: this.StorerId,
          time: Date.parse(new Date())
        }
        DELETEWarehousingTaskScannedInfo(params).then(res => {
          var result = res.data
          if (result.code == 0) {
            this.$message({
              message: '清空容器成功',
              type: 'success'
            });
            for (var i = this.ScanRecord.length - 1; i >= 0; i--) {
              if (value == this.ScanRecord[i].CID || value == this.ScanRecord[i]
                .BoxCode) {
                this.ScanRecord.splice(i, 1)
              }
            }
            this.audioPlay('success')
            this.SummarizeTaskInfo('init')
          } else {
            this.audioPlay('error')
            this.$message({
              message: res.data.message,
              type: 'error'
            });
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '清空操作已取消'
        });
      });
    },
    ScanBatchNoInfo (value) {
      var scanCount = 0.0
      var currinfo = {}
      this.AllGoods.forEach(items => {
        console.log(items.BatchNo === value && this.scanChildOrderLineFlag === items.ChildOrderNo, items.BatchNo, value, this.scanChildOrderLineFlag, items.ChildOrderNo)
        if (items.BatchNo === value && this.scanChildOrderLineFlag === items.ChildOrderNo) {
          // if (items.ChildOrderNo === value) {
          scanCount = Arithmetic.accAdd(scanCount, items.QtyPlan)
          currinfo = items
        }
      })
      if (parseFloat(scanCount) == 0.0) {
        this.audioPlay('error')
        this.$message({
          message: '批次号不存在',
          type: 'error'
        });
        return
      }
      this.CurrentGoods = JSON.parse(JSON.stringify(currinfo))
      this.SummarizeTaskInfo(value)
      if (parseFloat(this.CurrentGoods.DeliveryPack) <= this.scansTotalNum) {
        this.scansNum = parseFloat(this.CurrentGoods.DeliveryPack)
      } else {
        this.scansNum = parseFloat(this.scansTotalNum)
      }
      this.CurrentGoods.QtyIn = this.scansNum
      this.scanInputMethod('CID')
      this.audioPlay('ok')
    },
    // 扫描单号
    ScanChildOrderNoInfo (value) {
      var scanCount = 0.0
      var currinfo = {}
      var index_num = 0
      this.AllGoods.forEach(items => {
        if (items.ChildOrderNo === value) {
          index_num += 1
          // if (items.ChildOrderNo === value) {
          scanCount = Arithmetic.accAdd(scanCount, items.QtyPlan)
          currinfo = items
        }
      })
      if (index_num <= 0) {
        this.audioPlay('error')
        this.$message({
          message: '任务号不存在',
          type: 'error'
        });
        return
      }
      this.scanChildOrderLineFlag = value
      this.SummarizeTaskInfo(value)
      if (index_num > 1) {
        this.StorerId = currinfo.StorerId
        this.WarehouseId = currinfo.WarehouseId
        this.scanInputMethod('BatchNo')
      } else {
        this.CurrentGoods = JSON.parse(JSON.stringify(currinfo))
        this.StorerId = currinfo.StorerId
        this.WarehouseId = currinfo.WarehouseId
        if (parseFloat(this.CurrentGoods.DeliveryPack) <= this.scansTotalNum) {
          this.scansNum = parseFloat(this.CurrentGoods.DeliveryPack)
        } else {
          this.scansNum = parseFloat(this.scansTotalNum)
        }
        this.CurrentGoods.QtyIn = this.scansNum
        this.scanInputMethod('CID')
      }

      this.audioPlay('ok')
    },
    VerificationCID (value) {
      if (parseFloat(this.CurrentGoods.QtyIn) == 0.0 || parseFloat(this.scansNum) == 0.0) {
        this.audioPlay('error')
        this.$message({
          message: '请输入正确入库数量',
          type: 'error'
        });
        return
      }
      var regex = /^[a-zA-Z0-9]+$/;

      if (!regex.test(value)) {
        this.audioPlay('error')
        this.$message({
          message: '请输入正确料箱号（只含数字和字母）',
          type: 'error'
        });
        return
      }
      const params = {
        UserId: this.UserInfo.UserId,
        CID: value,
        WbId: this.UserInfo.WbInfo.WbId,
        time: Date.parse(new Date())
      }
      this.gLoad = true
      GetCIDInfoWC(params).then(res => {
        const result = res.data
        if (result.code == 0) {
          this.CurrentGoods.ToCID = value
          this.CurrentGoods.UserId = this.UserInfo.UserId
          this.CurrentGoods.WbId = this.UserInfo.WbInfo.WbId
          this.$message({
            message: res.data.data.errmsg,
            type: 'success'
          });
          this.TargetLocationId = res.data.data.LocationId
          this.VerificationLocation(this.TargetLocationId)
          this.Weight = parseInt(res.data.data.Weight) * 1000
          this.audioPlay('ok')
        } else {
          this.audioPlay('error')
          this.$message({
            message: result.message,
            type: 'error'
          });
        }
        this.gLoad = false
      }).catch(() => {
        this.gLoad = false
        throw error
      });

    },
    VerificationLocation (value) {
      const params = {
        UserId: this.UserInfo.UserId,
        LocationId: value,
        time: Date.parse(new Date())
      }
      GETLocationInfo(params).then(res => {
        const result = res.data.data
        if (result.length > 0 && res.data.code == 0) {
          if (result[0].CID == null || result[0].CID == '' || result[0].CID == this.CurrentGoods
            .ToCID) {
            if (result[0].Status == 1) {
              this.PTL_Lighting(value, this.ColorEnum.green)
              this.CurrentGoods.ToLoc = value
              this.Property15 = result[0].Property15
              this.PositionBinding = false
              this.unbindBottn = true
              this.scanInputMethod('PTLLighting')
              this.audioPlay('ok')
            } else {
              this.$message({
                message: '当前位置被禁用',
                type: 'error'
              });
              this.audioPlay('error')
            }
          } else {
            this.$message({
              message: '请确定当前位置是否已存在托盘',
              type: 'error'
            });
            this.audioPlay('error')
          }
        } else {
          this.audioPlay('notexist')
          this.$message({
            message: '托盘不存在',
            type: 'error'
          });
        }
      })
    },
    // 扫描库位操作
    ScanLocation (value) {
      if (this.CurrentGoods.ToLoc == value && this.CurrentGoods.ToLoc !== '') {
        console.log(this.CurrentGoods)
        // 加遮罩
        this.gLoad = true
        const params = {
          StorerId: this.CurrentGoods.StorerId,
          ChildOrderNo: this.CurrentGoods.ChildOrderNo,
          SkuId: this.CurrentGoods.SkuId,
          QtyPlan: this.CurrentGoods.QtyPlan,
          QtyIn: this.CurrentGoods.QtyIn,
          WbId: this.UserInfo.WbInfo.WbId,
          FromCID: this.CurrentGoods.CID,
          FromLoc: this.CurrentGoods.LocationId,
          ToCID: this.CurrentGoods.ToCID,
          ToLoc: this.CurrentGoods.ToLoc,
          BatchNo: this.CurrentGoods.BatchNo,
          UserId: this.UserInfo.UserId,
          Time: Date.parse(new Date())
        }
        PUTWarehousingWCTaskInfo(params).then(res => {
          const result = res.data
          if (res.data.code == 0) {
            console.log(result)
            if (result.code == 0) {
              // this.scanInputMethod('SkuID')
              // this.SummarizeTaskInfo('init')
              this.CurrentGoods = {}
              this.GETTaskInfo(this.CID)
              // this.PositionBinding = false

            } else {
              this.audioPlay('error')
              this.$message({
                message: result.message,
                type: 'error'
              });
              this.scanInputMethod('CID')
            }
          } else {
            this.audioPlay('error')
            this.$message({
              message: res.data.message,
              type: 'error'
            });
          }
          this.gLoad = false
        }).catch(error => {
          this.gLoad = false
          throw error
        })
      } else {
        this.$message({
          message: '请确定拍灯库位是否正确',
          type: 'error'
        });
        this.audioPlay('error')
      }
    },
    // 声音
    audioPlay (value) {
      this.audioPaly = value
      setTimeout(() => {
        this.audioPaly = ''
      }, 1500)
    },
    // WEBSOCKET 开始
    async init (socket_type = true, connect_num = 0) {
      if (socket_type === true || socket_type === 'print_ws') {
        this.ws.print_ws = null;
        this.ws.print_ws = new WebSocket(this.print_url + this.UserInfo.UserId);
        this.ws.print_ws.currSocketId = 'print_ws'
        this.ws.print_ws.connect_num = connect_num
        this.ws.print_ws.currSocketName = '打印机程序'
        this.ws.print_ws.onopen = this.ws_connect
        this.ws.print_ws.onmessage = function (e) {
          console.log('打印机_OnMessage');
        };
        this.ws.print_ws.onerror = this.ws_error
      }
      if (socket_type === true || socket_type === 'ptl_ws') {
        this.ws.ptl_ws = null;
        this.ws.ptl_ws = new WebSocket(this.ptl_url);
        this.ws.ptl_ws.currSocketId = 'ptl_ws'
        this.ws.ptl_ws.connect_num = connect_num
        this.ws.ptl_ws.currSocketName = '库位灯程序'
        this.ws.ptl_ws.onopen = this.ws_connect
        this.ws.ptl_ws.onmessage = this.PtlOnMessage
        this.ws.ptl_ws.onerror = this.ws_error
      }
      if (socket_type === true || socket_type === 'weight_ws') {
        this.ws.weight_ws = null;
        this.ws.weight_ws = new WebSocket(this.weight_url);
        this.ws.weight_ws.currSocketId = 'weight_ws'
        this.ws.weight_ws.connect_num = connect_num
        this.ws.weight_ws.currSocketName = '称重程序'
        this.ws.weight_ws.onopen = this.ws_connect
        this.ws.weight_ws.onmessage = this.WeightOnMessage
        this.ws.weight_ws.onerror = this.ws_error
      }
      if (socket_type === true || socket_type === 'login_ws') {
        this.ws.login_ws = null;
        this.ws.login_ws = new WebSocket(this.login_url + this.UserInfo.UserId);
        this.ws.login_ws.currSocketId = 'login_ws'
        this.ws.login_ws.currSocketName = 'WET登录'
        this.ws.login_ws.onopen = this.ws_connect
        this.ws.login_ws.connect_num = connect_num
        this.ws.login_ws.onmessage = function (e) {
          console.log('登录在线.....');
        };
        // this.ws.login_ws.onclose = (e) => {
        // 	console.log('登录断开');
        // 	this.$message({
        // 		message: e.currentTarget.currSocketName + ',连接被关闭,请联系管理员',
        // 		type: 'error'
        // 	});
        // 	clearInterval(this.setIntervalWesocketPush[e.currentTarget.currSocketId])
        // }
        this.ws.login_ws.onerror = this.ws_error
        this.ws_connect_login()
      }
    },
    ws_error (e) {
      this.onerrorWS(e.currentTarget)
    },
    onerrorWS (ws) {
      clearInterval(this.setIntervalWesocketPush[ws.currSocketId])
      console.log(ws.currSocketName, ws)
      if (ws.readyState === 3 && ws.connect_num < 3) {
        this.$message({
          message: ws.currSocketName + '连接失败,重连中......',
          type: 'error'
        });
        setTimeout(() => {
          this.init(ws.currSocketId, ws.connect_num + 1)
        }, 10000)
      } else {
        this.$message({
          message: '' + ws.currSocketName + '连接失败，无法重新连接，请联系管理员！',
          type: 'error'
        });
      }
    },
    ws_connect (e) {
      this.sendPing(e.currentTarget)
    },
    ws_connect_login () {
      if (this.ws.login_ws.readyState === 1) {
        var command = {
          RemoteUrl: this.UserInfo.RemoteUrl,
        };
        this.ws.login_ws.send(JSON.stringify(command));
      } else {
        setTimeout(() => {
          this.ws_connect_login()
        }, 1500)
      }
    },
    sendPing (ws, time = 15000, ping = 'ping.....') {
      console.log(ws.currSocketName + ' 连接成功......')
      clearInterval(this.setIntervalWesocketPush[ws.currSocketId])
      this.setIntervalWesocketPush[ws.currSocketId] = setInterval(() => {
        ws.send(ping)
      }, time)
    },
    // 拍灯消息
    PtlOnMessage (e) { // 创建接收消息函数
      const data = JSON.parse(e && e.data)
      if (data.Code !== 0) {
        this.audioPlay('error')
        this.$message({
          message: data.Message,
          type: 'error'
        });
        this.$notify.error({
          title: '提示',
          message: data.Message + ',指定库位为' + this.CurrentGoods.ToLoc,
          duration: 0
        });
        return
      }
      if (data.Type === 'PTL_Lighting') {
        console.log('PTL_Lighting', data)
      } else if (data.Type === 'PTL_Close') {
        console.log('PTL_Close', data)
      } else if (data.Type === 'PTL_OFF') {
        if (this.CurrentGoods.ToLoc != data.Data.Tag) {
          var msg = '灭灯库位非推荐库位,请按推荐库位放置料箱'
          if (this.scanType !== 'PTLLighting') {
            msg = '未推荐库位,当前拍灯无效'
          }
          this.$message({
            type: 'error',
            message: msg
          });
          this.audioPlay('error')
          return
        }
        this.WeightSocket(data.Data.Tag.toString())
      } else {
        this.$message({
          type: 'error',
          message: 'WET消息错误'
        });
      }
    },
    // 称重发送
    WeightSocket (locationId) {
      if (locationId == undefined || locationId == '') {
        this.$message({
          type: 'error',
          message: '推荐库位为空,不可点击完成'
        });
        this.audioPlay('error')
        return
      }
      const param = {
        "Id": new Date().getTime().toString() + locationId.toString(),
        "Type": "Weighting",
        "Data": {
          "Amass": 0,
          "Slave": parseInt(this.Property15),
          "Locationid": locationId.toString()
        }
      }
      try {
        this.ws.weight_ws.send(JSON.stringify(param))
      } catch (e) {
        //TODO handle the exception
        this.$message({
          type: 'error',
          message: '称重错误,请刷新或重启WET!'
        });
        this.audioPlay('error')
      }
    },
    // 打印条码
    PrintBarcode () {
      // 存储区不能为空,且需要扫描指定订单后才能打印条码。
      if (this.StorerId == '' || this.scanType == 'OrderID') {
        this.audioPlay('error')
        this.$message({
          type: 'info',
          message: '请先扫描要入库的订单信息'
        });
        return
      }
      this.$prompt('请输入要打印的物料编码', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
      }).then(({
        value
      }) => {
        var command = [{
          TaskId: value + '_' + Date.parse(new Date()).toString(),
          WarehouseId: this.WarehouseId,
          StorerId: this.StorerId,
          MenuId: "M222",
          Action: "Print",
          DataSourceParameter: "{'StorerId':'" + this.StorerId + "',SkuId:'" + value + "'}"
        }];
        this.ws.print_ws.send(JSON.stringify(command))
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '打印已取消'
        });
      });
    },
    WeightOnMessage (e) {
      let weight = 0
      const data = JSON.parse(e && e.data)
      if (data.Code !== 0) {
        this.audioPlay('error')
        this.$message({
          message: data.Message,
          type: 'error'
        });
        this.$notify.error({
          title: '提示',
          message: data.Message,
          duration: 0
        });
        return
      }
      if (data.Data.Weight >= 10) {
        console.log('WeightOnMessage', data)
        this.CurrWeight = Arithmetic.accDiv(data.Data.Weight, 1000)
        weight = Arithmetic.accDiv(data.Data.Weight, 1000)
        this.Weight_Flag = data.Data.Weight <= this.Weight
        if (data.Data.LocationId == this.TargetLocationId) {
          if (this.Weight_Flag) {
            this.scanInputMethod('PTLLighting')
            this.$message({
              message: '托盘重量【' + weight + 'KG】符合设定范围,正在提交',
              type: 'success'
            });
            this.ScanLocation(data.Data.LocationId)
          } else {
            this.$message({
              message: '托盘物料超重,请检查',
              type: 'error'
            });
            this.audioPlay('error')
            this.PTL_Lighting(this.CurrentGoods.ToLoc, this.ColorEnum.green)
          }
        } else {
          this.$message({
            message: '请确定称重库位是否正确',
            type: 'error'
          });
        }

      }
    },
    // 亮灯
    async PTL_Lighting (LocationId, Color) {
      const params = {
        "Id": new Date().getTime().toString(),
        "Type": "PTL_Lighting",
        "Data": {
          "Tag": LocationId,
          "Num": this.CurrentGoods.QtyIn.toString(),
          "Mode": "1",
          "Color": Color,
          "Updown": "2",
          "Locator": "",
          "Message": this.CurrentGoods.SkuId,
          "PressOff": "1"
        }
      }
      this.ws.ptl_ws.send(JSON.stringify(params))
    },
    // 关灯
    async PTL_Close (LocationId) {
      const params = {
        "Id": new Date().getTime().toString(),
        "Type": "PTL_Close",
        "Data": {
          "Tag": LocationId
        }
      }
      this.ws.ptl_ws.send(JSON.stringify(params))
    },
    // WEBSOCKET 结束
    enterScanInput () {
      if (!this.checkInputEmpty()) {
        return
      }
      const value = this.scanInput.replace(/\ +/g, "").replace(/[\r\n]/g, "");
      this.scanInput = value
      // 订单信息
      if (this.scanType == 'OrderID') {
        this.GETTaskInfo(value, true)
      }
      // SKU编码
      else if (this.scanType == 'ChildOrderNo') {
        // this.ScanSkuInfo(value)
        this.ScanChildOrderNoInfo(value)
      }
      // 托盘信息
      else if (this.scanType == 'CID') {
        this.VerificationCID(value)
      }
      else if (this.scanType == 'BatchNo') {
        this.ScanBatchNoInfo(value)
      }
      // 库位信息
      else if (this.scanType == 'LocationId') {
        this.VerificationLocation(value)
      }
      // 拍灯信息
      else if (this.scanType == 'PTLLighting') {
        // this.VerificationLocation(value)
      } else {
        this.audioPlay('error')
        this.$message({
          message: '系统错误,请刷新当前页面',
          type: 'error'
        });
        return
      }
      try {
        this.$nextTick(() => {
          this.$refs.scanInputfocus.focus()
        })
      } catch (e) {
        console.log(e)
      }

    },
    // 判断应扫描数是否大于等于输入扫描数
    clickCardOk (value) {
      console.log('clickCardOk', value)
      if (parseFloat(this.scansTotalNum) >= parseFloat(value) && parseFloat(value) >= 0.0) {
        this.scansNum = parseFloat(value)
        this.CurrentGoods.QtyIn = parseFloat(value)
        this.CalculatorDialogVisible = false
      } else {
        this.audioPlay('error')
        this.$message({
          message: '扫描数不能大于应扫描总数,且应为正数',
          type: 'warning'
        });
        this.scansNum = parseFloat(this.scansTotalNum);
        this.CurrentGoods.QtyIn = parseFloat(this.scansNum);
      }
    },
    clickCardOk_wc (queryString, cb) { console.log(queryString, cb) },
    // 屏幕显示计算 Value 如果为init为计算初始化数据。
    SummarizeTaskInfo (value) {
      var allcount = 0.0
      var allscancount = 0.0
      var currentRecord = 0.0
      if (value == 'init') {
        this.AllGoods.forEach(item => {
          // 计算全部扫描数
          allscancount = Arithmetic.accAdd(allscancount, item.QtyPlan)
        })
        // this.ScannedGoods.forEach(item => {
        // 	// 计算已扫描数量、
        // 	allcount += item.QtyIn
        // })
        // this.ScanRecord.forEach(item => {
        //   // 计算本次已扫描数
        //   currentRecord = Arithmetic.accAdd(currentRecord, item.QtyIn)
        // })
        this.ScanAllCount = allscancount
        this.ScanGoodCount = Arithmetic.accAdd(allcount, currentRecord)
        // 将全部扫描数输出到屏幕
        this.scansTotalNum = this.ScanAllCount
        // 把已扫描数量输出
        this.scansNum = 0 //this.ScanGoodCount
        // &&currentRecord!=allscancount
        // this.PositionBinding = parseFloat(currentRecord) <= 0.0;
        return
      }
      this.AllGoods.forEach(item => {
        // if (item.UpcCodes.indexOf(value) != -1) {
        if (value === item.ChildOrderNo || (value === item.BatchNo && this.scanChildOrderLineFlag === item.ChildOrderNo)) {
          // if (value === item.BatchNo) {
          // 计算全部扫描数
          allscancount = Arithmetic.accAdd(allscancount, item.QtyPlan)
        }
      })
      // 计算已扫描数
      // this.ScanRecord.forEach(item => {
      //   // if (item.UpcCodes.indexOf(value) != -1) {
      //   if (value===item.ChildOrderNo) {
      //
      //     currentRecord = Arithmetic.accAdd(currentRecord, item.QtyIn)
      //   }
      // })
      // 将全部扫描数输出到屏幕
      this.scansTotalNum = Arithmetic.accSub(Arithmetic.accSub(allscancount, allcount), currentRecord)
      // 把已扫描数量输出
      this.scansNum = 0.0
    },
    // 改变扫描框
    scanInputMethod (newType) {
      if (this.scanInputType[newType] === undefined) {
        return
      }
      if (newType == 'OrderID') {
        this.LocationId = ''
        this.CurrentGoods = {}
        this.CID = ''
        // 全部应扫描物料
        this.AllGoods = []
        // 已扫描物料
        this.ScannedGoods = []
        // 显示扫描记录
        this.ScanRecord = []
        // 完成任务或者呼叫空托提交的扫描记录
        this.CommitScanRecord = []
        // 全部入库数（不考虑物料种类）
        this.ScanAllCount = 0.0
        // 当前扫描数
        this.ScanCurrentCount = 0.0
        // 已扫描物料数（不考虑物料种类）
        this.ScanGoodCount = 0.0
        // 页面显示应扫描数
        this.scansTotalNum = 0.0
        // 页面显示当前已扫描数
        this.scansNum = 0.0
        this.WarehouseId = ''
        this.StorerId = ''
        this.unbindBottn = true
      }
      this.CurrWeight = 0
      this.Weight_Flag = false
      this.scanInput = ''
      this.scanInputPlaceholder = this.scanInputType[newType];
      this.scanType = newType;
      try {
        this.$nextTick(() => {
          this.$refs.scanInputfocus.focus()
        })
      } catch (e) {
        console.log(e)
      }
    },
    // 点击计算器验证

    clickCalculator () {
      if (this.scanType == 'CID' || this.scanType == 'PTLLighting') {
        this.CalculatorDialogVisible = true
        this.$nextTick(() => {
          this.$refs.scansNumREF.focus()
        })
        return
      }
      this.audioPlay('error')
      this.$message({
        message: '获取订单并且扫描SKU后才能对数量进行操作',
        type: 'error'
      });
    },
    // 检查输入扫描框是否为空
    checkInputEmpty () {
      if (this.scanInput == '') {
        this.audioPlay('error')
        this.$message({
          message: '请检查扫描框内容是否为空',
          type: 'error'
        });
        return false
      }
      return true
    }
  },
  beforeRouteLeave (to, from, next) {
    var key;
    for (key in this.ws) {
      console.log(this.ws[key])
      if (this.ws[key] !== null) {
        this.ws[key].close()
        clearInterval(this.setIntervalWesocketPush[this.ws[key].currSocketId]);
        this.ws[key] = null;
      }
    }
    next();
  },
  watch: {
    searchVal: function (val) {
      console.log(val); // 接收父组件的值
      this.WindowsSize = val;
    }
  },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>
.my-label {
  font-size: 1.3vw;
  width: 10vw;
  /* font-weight: 550 !important; */
  text-align: center !important;
  color: #000000 !important;
}

.my-content {
  color: #000000;
  font-size: 1.3vw;
  /* font-weight: 550 !important; */
  width: 40vw;
}
</style>
<style scoped lang="scss">
.card_box {
  margin-top: 5px;
}

.card_button {
  margin-top: 20px;
  height: 10vh;
  border: none;
  display: flex;
  margin-left: 6vw;

  .el-card__body {
    & > .el-button {
      margin-left: 1vw;
    }
  }
}

.box-card_detail {
  height: 45vh;
}

.paddingStyle {
  /deep/ .el-card__body {
    padding: 0px !important;
  }
}

.dialog_commit {
  .el-form {
    .el-form-item {
      /deep/ .el-form-item__label {
        font-size: 2.5vh;
        line-height: 4vh;
      }

      .el-form-item__content {
        .el-input {
          /deep/ .el-input__inner {
            height: 5vh;
            font-size: 2.5vh;
          }
        }
      }
    }
  }
}

.ItemNumInfo {
  font-size: 6vh;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  color: #ff0000;
  margin-top: 2vh;
  font-size: 5vh;
  .is-without-controls {
    /deep/ .el-input__inner {
      padding-left: 0;
      padding-right: 0px;
      font-size: 5vh;
      height: 100%;
      border: none;
      text-align: right;
      color: blue;
    }
  }
}

.ItemNumlabel {
  font-size: 3vh;
  margin-top: 1vh;
}

.ItemNumInfoDetail {
  font-size: 2.5vh;
  margin-top: 1.5vh;
  // border: 1px solid #CCCCCC;
}

.ItemNumInfoDetail_Weight {
  font-size: 3.4vh;
  margin-top: 1.5vh;
  color: #ff0000;
}

.imageClass {
  .el-image {
    // &>img {
    /deep/ .el-image__inner {
      height: 80%;
      width: 38.9vh;
    }
  }
}

.buttonClass {
  width: 200px;
  height: 70px;
  font-size: 25px;
}

// .pagination {
// 	margin-top: 20px;
// 	text-align: right;
// }
// .el-form-item {
//     margin-bottom: 0px !important;
// }
// .el-form {
// 	display: flex;
// }
// 顶部扫描框
.headerInputClass {
  height: 11vh;

  /deep/ .el-input__inner {
    height: 100%;
    font-size: calc(100vh - 93vh);
    background-color: rgb(84, 105, 122);
    color: #ffffff;
  }

  /deep/ .el-input__inner::-webkit-input-placeholder {
    color: #ffffff;
  }
}

.el-message-box {
  .el-message-box__content {
    .el-message-box__container {
      .el-message-box__message {
        & > p {
          font-size: 25px;
        }
      }
    }
  }
}

// 卡片头部
/deep/ .el-card__header {
  padding: 8px 32px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both;
}
</style>